﻿
@{
    ViewBag.Title = "Filters";
}

<div ng-app="app.FilterView" ng-controller="filterCtrl">

    <div class="row">
        <div class="col-md-5">
            <h2>AngularJs Filter Beispiele</h2>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-offset-4 col-md-4">
            <input type="text" class="form-control" placeholder="Filter hier eingeben" ng-model="textfilter" />
        </div>
    </div>

    <div class="row">
        <div class="col-md-12">
            <table class="table table-condensed">
                <thead>
                    <tr>
                        <th>Id</th>
                        <th>Vorname</th>
                        <th>Nachname</th>
                        <th>Gehalt</th>
                        <th>Bonus</th>
                        <th>Gesamt</th>
                        <th>Geburtsdatum</th>
                        <th>Telefon</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="data in demoData | filter: textfilter | orderBy:summary">
                        <td ng-bind="data.id"></td>
                        <td ng-bind="data.fname | uppercase"></td>
                        <td ng-bind="data.lname | lowercase"></td>
                        <td ng-bind="data.gehalt | currency : 'EUR ' "></td>
                        <td ng-bind="data.bonus | currency"></td>
                        <td ng-bind="data.bonus + data.gehalt | currency"></td>
                        <td ng-bind="data.birthdate | date:shortDate"></td>
                        <td ng-bind="data.tel"></td>
                    </tr>
                </tbody>

            </table>
        </div>
    </div>
</div>


@section scripts
{
    <script type="text/javascript" src="~/ScriptsAngular/ctrl/filterCtrl.js"></script>
    <script type="text/javascript" src="~/ScriptsAngular/srv/demoDataSrv.js"></script>
    <script type="text/javascript" src="~/ScriptsAngular/view/Home/initFilterView.js"></script>
}

